<template>
  <t-card :bordered="false">

    <!-- 自定义表格 -->
    <custom-table
      ref="customTableRef"
      row-key="id"
      :columns="columns"
      :api="engineeringMaterialSpeedListCRUD.page"
      column-controller-key="EngineeringMaterialList"
    >
    <template #notificationTime="{ row }">
        {{ row.notificationTime?dayjs(row.notificationTime).format('YYYY-MM-DD'):'' }}
      </template>
      <template #completeTime="{ row }">
        {{ row.completeTime?dayjs(row.completeTime).format('YYYY-MM-DD'):'' }}
      </template>


      
      <template #operation="{ row }">
        <t-space break-line>
          
          <t-link 
            theme="primary" 
            v-permission="['system:engineering-material-speed:update']" 
            v-if="!row.notificationTime" 
            @click="handleOpenDialog('update', { id: row.id, name: row.name },true)"
          > 确认通知 </t-link>
          
          <t-link 
            theme="primary" 
            v-permission="['system:engineering-material-speed:confirm-complete']" 
            v-if="!row.completeTime"
            @click="handleOpenDialog('update', { id: row.id, name: row.name, engineeringId: engineeringDetails.id, orderId: engineeringDetails.orderId },false)"
          > 确认完成 </t-link>
  
    
        </t-space>
      </template>
    </custom-table>
     <!-- 自定义对话框 -->
    <custom-dialog ref="customDialogRef" v-slot="{ formData }" :api-map="isNotice?{update:engineeringMaterialSpeedListCRUD.update}:{update:engineeringMaterialSpeedConfirmComplete}" :header="isNotice?'选择通知时间':'选择发送通知'"
     @request-success="handleDialogRequestSuccess">
      
      <t-form-item v-if="isNotice" label="通知时间" name="notificationTime" :rules="[
        { required: true, message: '请选择通知时间' },
      ]" >
        <t-date-picker allow-input v-model:value="formData.notificationTime" clearable value-type="time-stamp" placeholder="请选择通知时间"
          style="width: 100%" @change="
            (value) => {
              if (value) {
                value = dayjs(value).format('YYYY-MM-DD 00:00:00');
                value = dayjs(value).valueOf();
              }
              formData.notificationTime = value ? value : undefined;
            }
          " />
      </t-form-item>
       <t-form-item label="发送通知" v-if="!isNotice" name="isSend" :rules="[
        { required: true, message: '请选择发送通知' },
      ]" >
        <t-select
            v-model:value="formData.isSend"
            :options="[
              { label: '是', value: '1' },
              { label: '否', value: '0' },
            ]"
            clearable
            filterable
            placeholder=""
          />
      </t-form-item>
      
    </custom-dialog>




   

  </t-card>
</template>


<script setup lang="ts">
import dayjs from 'dayjs';
import { MessagePlugin, TableCol } from 'tdesign-vue-next';
import { inject, onMounted, Ref, ref, useTemplateRef } from 'vue';

import { engineeringMaterialSpeedListCRUD, engineeringMaterialSpeedConfirmComplete } from '@/api/project/details';
import CustomTable from '@/components/custom/table/index.vue';
import CustomDialog from '@/components/custom/dialog/index.vue';
import { useDictionaryStore } from '@/store';

// 字典仓库
const dictionaryStore = useDictionaryStore();
// 施工详情
const engineeringDetails = inject<Ref<Record<string, any>>>('engineeringDetails');
// 自定义表格ref
const customTableRef = useTemplateRef('customTableRef');
// columns
const columns: TableCol[] = [
  { colKey: 'name', title: '阶段名称' },
  { colKey: 'notificationTime', title: '通知时间' },
  { colKey: 'completeTime', title: '完成时间' },
  { colKey: 'operation', title: '操作', fixed: 'right' },
];


// 处理初始化表格
const handleInitTable = () => {
  const params = { 
    engineeringId: engineeringDetails.value.id
  };
  customTableRef.value.initTable(params);
};
// 处理刷新表格
const handleRefreshTable = () => {
  customTableRef.value.refreshTable();
};
onMounted(() => {
  handleInitTable();
});

// 处理确认完成
const handleConfirmComplete = (params: Record<string, any>) => {
  engineeringMaterialSpeedConfirmComplete(params)
    .then(() => {
      MessagePlugin.success(`${params.name}确认完成`);
      handleRefreshTable();
    })
    .catch(({ message }) => {
      MessagePlugin.error(message);
    });
};
// 处理确认通知
const handleConfirmNotice = (params: Record<string, any>) => {
  const {name,...rest} = params
  engineeringMaterialSpeedListCRUD.update(params)
    .then(() => {
      MessagePlugin.success(`${name}确认通知`);
      handleRefreshTable();
    })
    .catch(({ message }) => {
      MessagePlugin.error(message);
    });
};
// 对话框请求成功
const handleDialogRequestSuccess = (result: Record<string, any>) => {
  if (result.mode === 'create') handleInitTable();
  if (result.mode === 'update') handleRefreshTable();
};
// 自定义对话框ref
const customDialogRef = useTemplateRef('customDialogRef');
const isNotice = ref(true)
// 处理打开对话框
const handleOpenDialog = (mode: 'create' | 'read' | 'update', params: Record<string, any>, isNotic: boolean) => {
  customDialogRef.value.open(mode, params);
  isNotice.value = isNotic
};
</script>



